import { App, ConfigProvider } from 'antd';
import { ConfigProviderProps } from 'antd/es/config-provider';

import zhCN from 'antd/es/locale/zh_CN';

export type { ConfigProviderProps as YmConfigProviderProps };
export function YmConfigProvider({
  children,
  theme,
  ...props
}: ConfigProviderProps) {
  const { token, components = {}, ...restTheme } = theme ?? {};
  const { Avatar, ...componentsRest } = components;
  return (
    <ConfigProvider
      locale={zhCN}
      theme={{
        token: {
          colorPrimary: '#f66e2c',
          borderRadius: 4,
          wireframe: true,
          ...token,
        },
        components: {
          Avatar: {
            lineWidth: 0,
            colorTextPlaceholder: 'transparent',
            ...Avatar,
          },
          Tree: {
            controlItemBgActive: '#F1F1F1',
          },
          Pagination: {
            colorBgTextHover: 'transparent',
          },
          ...componentsRest,
        },
        ...restTheme,
      }}
      componentSize="middle"
      {...props}
    >
      <App>{children}</App>
    </ConfigProvider>
  );
}
